<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta
            name="viewport"
            content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
        />
        <title>Document</title>
        <script src="./ezuikit.js"></script>
    </head>

    <body>
        <div className="demo">
            <h2>视频模式使用示例：</h2>
            <div id="video-container" style="width: 600px"></div>
            <div id="video-container2" style="width: 600px"></div>
            <!-- <div>
      <button onClick="play()">play</button>
      <button onClick="stop()">stop</button>
      <button onClick="getOSDTime()">getOSDTime</button>
      <button onClick="getOSDTime2()">getOSDTime2</button>
      <button onClick="capturePicture()">capturePicture</button>
      <button onClick="openSound()">openSound</button>
      <button onClick="closeSound()">closeSound</button>
      <button onClick="startSave()">startSave</button>
      <button onClick="stopSave()">stopSave</button>
      <button onClick="ezopenStartTalk()">开始对讲</button>
      <button onClick="ezopenStopTalk()">结束对讲</button>
      <button onClick="fullScreen()">全屏</button>
    </div> -->
            <p style="font-style: italic">
                播放多个视频，可初始化多个实例，参考：/demos/base-demo/multi-demo
            </p>
        </div>
        <!-- <script>
            var player2;
            url_accessToken = "https://open.ys7.com/api/lapp/token/get";
            data = {
                appKey: "f0ef37f581da4e1da29bbcacf1e377a0",
                appSecret: "17fc1a08cc188f5393c4ea4df7dc65d9",
            };
            response = requests.post((url = url_accessToken), (data = data));
            accessToken = json.loads(response.text)["data"]["accessToken"];
            player2 = new EZUIKit.EZUIKitPlayer({
                id: "video-container2", // 视频容器ID
                accessToken: accessToken,
                url: "ezopen://open.ys7.com/BE0998574/1.live",
                template: "simple", // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版; theme-可配置主题；
                plugin: ["talk"], // 加载插件，talk-对讲
                width: 600,
                height: 400,
            });
           
        </script> -->
        <script>
            let player2;

            async function getAccessToken() {
                const url_accessToken =
                    "https://open.ys7.com/api/lapp/token/get";

                let appKey = "f0ef37f581da4e1da29bbcacf1e377a0";
                let appSecret = "17fc1a08cc188f5393c4ea4df7dc65d9";

                try {
                    const response = await fetch(url_accessToken, {
                        method: "POST",
                        headers: {
                            "Content-Type": "application/json",
                            "Content-Type": "application/x-www-form-urlencoded",
                        },
                        body: `appKey=${appKey}&appSecret=${appSecret}`,
                    });
                    const result = await response.json();
                    console.log(result);

                    return result.data.accessToken;
                } catch (error) {
                    console.error("Error fetching access token:", error);
                }
            }

            async function initializePlayer() {
                try {
                    const accessToken = await getAccessToken();
                    player2 = new EZUIKit.EZUIKitPlayer({
                        id: "video-container2", // 视频容器ID
                        accessToken: accessToken,
                        url: "ezopen://open.ys7.com/BE0998574/1.live",
                        template: "simple", // simple - 极简版; standard - 标准版; security - 安防版(预览回放); voice - 语音版; theme - 可配置主题；
                        plugin: ["talk"], // 加载插件，talk-对讲
                        width: 600,
                        height: 400,
                    });
                } catch (error) {
                    console.error("Error initializing player:", error);
                }
            }

            // 初始化播放器
            initializePlayer();
        </script>
    </body>
</html>
